<!DOCTYPE html>
<html lang="en" ng-app="chat">
<head>
    <meta charset="utf-8">
    <title>聊天室首页</title>
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="Cache-Control" content="no-store, no-cache, must-revalidate, max-age=0">
    <link href="webjars/bootstrap/css/bootstrap.min.css" rel="stylesheet">
    <link href="webjars/flat-ui/bcaf2de95e/css/flat-ui.css" rel="stylesheet">
    <link href="static/css/jquery.mobile.flatui.css" rel="stylesheet">
    <link href="static/css/mchat.css" rel="stylesheet">
</head>
<body ng-controller="ChatController">
<div data-role="page">
    <div data-role="header" class="header linear-g">
        <a href="#panel-left" data-iconpos="notext" class="glyphicon glyphicon-th-large col-xs-2 text-right"> </a>
        <a class="text-center col-xs-8">developer.cn.com</a>
        <a href="#panel-right" data-iconpos="notext" class="glyphicon glyphicon-user col-xs-2 text-left"> </a>
    </div>
    <div data-role="panel" data-position="left" data-display="push" class="list-group shortcut_menu dn linear-g" id="panel-left">
        <a href="#" class="list-group-item"><span class="glyphicon glyphicon-home"> </span> &nbsp;菜单1</a>
        <a href="#" class="list-group-item"><span class="glyphicon glyphicon-edit"> </span> &nbsp;菜单2</a>
        <a href="#" class="list-group-item"><span class="glyphicon glyphicon-list"> </span> &nbsp;菜单3</a>
        <a href="#" class="list-group-item"><span class="glyphicon glyphicon-list-alt"> </span> &nbsp;菜单4</a>
    </div>
    <div data-role="panel" data-position="right" data-display="push" class="list-group text-center dn linear-g" id="panel-right">
        <div class="u_info">
            <img class="avatar" src="static/images/avatar.png" alt="头像">
            <span class="username">developer</span>
        </div>
        <ul class="user_menu">
            <li class="menu"><a href="#"><span class="glyphicon glyphicon-cog"> </span> &nbsp;基本设置</a></li>
            <li class="menu"><a href="#"><span class="glyphicon glyphicon-lock"> </span> &nbsp;修改密码</a></li>
            <li class="menu"><a href="#"><span class="glyphicon glyphicon-picture"> </span> &nbsp;上传头像</a></li>
            <li class="menu"><a href="#"><span class="glyphicon glyphicon-off"> </span> &nbsp;安全退出</a></li>
        </ul>
    </div>
    <div data-role="content" class="container" role="main">
        <ul class="content-reply-box mg10">
            <li ng-repeat="m in ms" class="odd">
                <a class="user" href="#" ng-click="sendTo(m.from)"><img class="img-responsive avatar_" src="static/images/avatar-1.png" alt=""><span class="user-name">{{m.from}}</span></a>
                <div class="reply-content-box">
                    <span class="reply-time">{{m.time}}</span>
                    <div class="reply-content pr">
                        <span class="arrow">&nbsp;</span>
                        {{m.content}}
                    </div>
                </div>
            </li>
        </ul>
    </div>
    <div>
        <div>提示输入:@人名+; 进行私聊或点击要私聊的人</div>
        <input ng-model="msg" /><button ng-click="sendMessage()">发送</button>
    </div>
</div>




<!-- 第三方 js 框架 -->
<script src="webjars/jquery/jquery.min.js"></script>
<script src="webjars/bootstrap/js/bootstrap.js"></script>
<script src="webjars/sockjs-client/sockjs.min.js"></script>
<script src="webjars/stomp-websocket/stomp.min.js"></script>
<script src="webjars/angular/angular.min.js"></script>
<script src="webjars/angular-ui-bootstrap-bower/ui-bootstrap.min.js"></script>
<script src="webjars/angular-ui-bootstrap-bower/ui-bootstrap-tpls.min.js"></script>
<script src="static/js/jquery.mobile-1.4.0-rc.1.js"></script>

<!-- 应用程序 js  -->
<script src="static/js/app.js"></script>
<script src="static/js/controllers.js"></script>
<script src="static/js/services.js"></script>

</body>
</html>
